<template>
  <yt-page title="通知公告详情" scroll>
    <yt-form>
      <yt-card title="基本信息">
        <yt-cell label="发文部门">{{ currentData.sending_department }}</yt-cell>
        <yt-cell label="公告标题">{{ currentData.bulletin_title }}</yt-cell>
        <yt-cell label="发文时间">{{ currentData.createdAt | formatTime('YYYY-MM-DD')}}</yt-cell>
        <yt-cell label="截止时间" border="none">{{ currentData.end_time }}</yt-cell>
      </yt-card>
      <yt-card title="公告内容">
        <div class="content">
          {{ currentData.bulletin_content }}
        </div>
      </yt-card>
      <yt-card title="公告附件">
        <yt-cell-open-file :title="file.name" :url="file.url" :key="index" v-for="(file, index) in currentData.file">
          {{ file.name }}
        </yt-cell-open-file>
        <p class="card-no-data" v-if="!currentData.file">暂无附件</p>
      </yt-card>
      <yt-btn slot="btn" v-if="record.state === 0" :loading="onSign" edge>签收</yt-btn>
    </yt-form>
  </yt-page>
</template>

<script>
import { commonApi } from '@/common/api/commonApi.js'
import { ReplaceDictionary } from '@/common/utils/index.js'

export default {
  data() {
    return {
      currentData: {},
      record: {}
    }
  },
  methods: {
    async onSign(loaded) {
      try {
        await commonApi.save('WJ_notice_bulletin_records', {
          id: this.record.id,
          state: 1
        })
        this.record.state = 1
        this.$Toast('签收成功!', 'success')
      } catch (e) {
        this.$Toast('签收失败!', 'error')
      }
      loaded()
    }
  },
  async activated() {
    let p = [
      commonApi.dictionary('sending_department'),
      commonApi.searchById('WJ_notice_bulletin', this.$route.query.id),
      commonApi.searchById(
        'WJ_notice_bulletin_records',
        this.$route.query.recordId
      )
    ]
    let [department, data, record] = await Promise.all(p)
    this.record = record
    this.currentData = ReplaceDictionary(data, {
      sending_department: department
    })
  }
}
</script>

<style scoped lang="stylus">
.title
  text-align center
  margin 15px
  font-weight bold
  font-size 18px

.desc
  font-size 14px
  color #666
  clear both

  span
    margin 10px

  .left
    float left

  .right
    float right

.content
  text-indent 10px
  font-size 14px
  padding 0 10px
  min-height 100px
  line-height 30px
  color #222

.card-no-data
  color #ddd
  font-size 14px
  text-align center
</style>
